<section class="header clearfix">
  {{#if isView}}
    <div class="right-buttons pull-right">
      {{badge-state model=model}}
      {{action-menu
        model=model
        showPrimary=false
        classNames="ml-10 inline-block"
        size="sm"
      }}
    </div>
  {{/if}}
  <h1>
    {{title}}
  </h1>
</section>
{{#if isView}}
  {{#if model.description}}
    {{banner-message
      color="bg-secondary mb-0 mt-10"
      message=(linkify model.description)
    }}
  {{/if}}
  {{#if model.showTransitioningMessage}}
    <div class="{{model.stateColor}}">
      <p>
        {{uc-first model.transitioningMessage}}
      </p>
    </div>
  {{/if}}
{{else}}
  {{form-name-description
    model=primaryResource
    nameRequired=false
    nameDisabled=isEdit
    namePlaceholder="cruPersistentVolume.name.placeholder"
    descriptionPlaceholder="cruPersistentVolume.description.placeholder"
    editing=editing
  }}
{{/if}}
{{#if isView}}
  <div class="row banner bg-info basics">
    <div class="vertical-middle">
      <label class="acc-label vertical-middle p-0">
        {{t "cruPersistentVolume.source.label"}}
      </label>
      {{t (concat "volumeSource." sourceName ".title")}}
    </div>
    <div class="vertical-middle">
      <label class="acc-label vertical-middle p-0">
        {{t "cruPersistentVolume.capacity.label"}}
      </label>
      {{capacity}}
      {{t "cruPersistentVolume.capacity.unit"}}
    </div>
    <div class="vertical-middle">
      <label class="acc-label vertical-middle p-0">
        {{t "cruPersistentVolume.reclaimPolicy"}}
      </label>
      {{model.persistentVolumeReclaimPolicy}}
    </div>
  </div>
  <div class="row banner bg-info basics">
    <div class="vertical-middle">
      <label class="acc-label vertical-middle p-0">
        {{t "cruPersistentVolume.pvc"}}
      </label>
      {{#if model.displayPvc}}
        {{model.displayPvc}}
      {{else}}
        <span class="text-muted">
          {{t "generic.na"}}
        </span>
      {{/if}}
    </div>
    <div class="vertical-middle">
      <label class="acc-label vertical-middle p-0">
        {{t "generic.created"}}
      </label>
      {{date-calendar model.created}}
    </div>
  </div>
{{else}}
  <div class="row">
    <div class="col span-6">
      <label class="acc-label">
        {{t "cruPersistentVolume.source.label"}}
        {{#if isNew}}
          {{field-required editing=editing}}
        {{/if}}
      </label>
      {{#input-or-display editable=isNew value=sourceDisplayName}}
        {{new-select
          content=supportedSourceChoices
          prompt="cruPersistentVolume.source.prompt"
          localizedPrompt=true
          optionValuePath="name"
          value=sourceName
        }}
      {{/input-or-display}}
    </div>
    <div class="col span-6">
      <label class="acc-label">
        {{t "cruPersistentVolume.capacity.label"}}
        {{#if isNew}}
          {{field-required editing=editing}}
        {{/if}}
      </label>
      <div class="input-group">
        {{input-number classNames="form-control" value=capacity}}
        <span class="input-group-addon bg-default">
          {{t "cruPersistentVolume.capacity.unit"}}
        </span>
      </div>
      {{#if isEdit}}
        <p class="help-block">
          {{t "cruPersistentVolume.capacity.protip" htmlSafe="true"}}
        </p>
      {{/if}}
    </div>
  </div>
{{/if}}
<hr class="mb-20" />
{{#accordion-list showExpandAll=false as |al expandFn|}}
  {{#accordion-list-item
    title=(t "cruPersistentVolume.source.title")
    detail=(t "cruPersistentVolume.source.detail")
    expandAll=expandAll
    expand=(action expandFn)
    expandOnInit=true
  }}
    {{#if sourceComponent}}
      {{component
        sourceComponent
        volume=model
        sourceStore=clusterStore
        editing=isNew
      }}
    {{else}}
      <p class="text-muted">
        {{t "cruVolume.sourcePrompt"}}
      </p>
    {{/if}}
  {{/accordion-list-item}}
  {{#accordion-list-item
    title=(t "cruPersistentVolume.customize.title")
    detail=(t "cruPersistentVolume.customize.detail")
    expandAll=expandAll
    expand=(action expandFn)
    everExpanded=true
    expandOnInit=isEdit
  }}
    <div class="row">
      <div class="col span-6">
        {{form-access-modes model=primaryResource mode=mode}}
      </div>
      <div class="col span-6">
        {{form-value-array
          initialValues=primaryResource.mountOptions
          editing=(not isView)
          valueLabel="cruPersistentVolume.mountOptions.label"
          addActionLabel="cruPersistentVolume.mountOptions.addActionLabel"
          noDataLabel="cruPersistentVolume.mountOptions.noData"
          changed=(action "updateOptions")
        }}
      </div>
    </div>
    <div class="row">
      <div class="col span-6">
        <label class="acc-label">
          {{t "cruPersistentVolume.storageClass.label"}}
        </label>
        {{#if editing}}
          {{new-select
            content=storageClasses
            prompt="cruPersistentVolume.storageClass.prompt"
            localizedPrompt=true
            optionLabelPath="displayName"
            optionValuePath="id"
            value=primaryResource.storageClassId
          }}
        {{else}}
          <div>
            {{#if primaryResource.storageClassId}}
              <a
                href="{{href-to
                    "authenticated.cluster.storage.classes.detail.index"
                    primaryResource.storageClassId
                  }}"
              >
                {{primaryResource.storageClass.displayName}}
              </a>
            {{else}}
              <span class="text-muted">
                {{t "generic.none"}}
              </span>
            {{/if}}
          </div>
        {{/if}}
      </div>
    </div>
    <div class="row mt-20">
      <label class="acc-label">
        {{t "cruPersistentVolume.nodeAffinity.label"}}
      </label>
      {{form-node-affinity
        model=model.nodeAffinity.required
        editing=notView
        changed=(action "updateNodeAffinities")
      }}
    </div>
  {{/accordion-list-item}}
  {{#if isView}}
    {{resource-event-list
      resourceType=(t "generic.persistentVolume")
      expandAll=al.expandAll
      expandFn=expandFn
      name=model.name
      kind="PersistentVolume"
    }}
    {{annotations-section model=model expandAll=al.expandAll expandFn=expandFn}}
  {{/if}}
{{/accordion-list}}
{{#unless isView}}
  {{top-errors errors=errors}}
  {{save-cancel
    editing=true
    save=(action "save")
    cancel=(action "viewEditCancel")
  }}
{{/unless}}